<template>
  <j-modal
    title="打印收费凭证"
    :width="800"
    :visible="visible"
    @cancel="handleCancel"
    @ok="handleOk"
    @update:fullscreen="isFullscreen"
    wrapClassName="j-depart-select-modal"
    :switchFullscreen="true">
      <template slot="footer">
        <a-button v-print="'#printHtml'" ghost type="primary">打印</a-button>
      </template>
      <div ref="printHtml" id="printHtml" class="content" >
        <p>现水费{{model.water_fee/100}}元/亩，
          <span v-if="model.tillageArea>100">
            大户水稻保险费{{model.big_rice_insurance_fee/100}}元/亩，
            大户服务费{{model.serve_fee/100}}元/亩。
          </span>
          <span v-else>水稻保险费{{model.rice_insurance_fee/100}}/亩，</span>
          村民{{model.farmName}}共耕种{{model.tillageArea}}亩土地，现缴费{{(model.insuranceFee + model.waterFee + model.serveFee).toFixed(2)}}元。</p>
        <p>特此证明！</p>
        <br><br>
        <p style="text-align: right">{{model.now}}</p>
      </div>
  </j-modal>
</template>

<script>
export default {
  name: 'VcaPrintVillageReceipt',
  data(){
    return {
      title:"",
      fullscreen:false,
      visible:false,
      model:{}
    }
  },
  mounted() {
  },
  methods: {
    view(record,fee) {
      this.model = Object.assign({}, record);
      fee.forEach(item=>{
        this.model[item.text]=item.value;
      });
      var date = new Date();
      this.model.now=date.getFullYear()+"年"+(date.getMonth()+1)+"月"+(date.getDate())+"日";
      this.visible = true;
    },
    handleCancel(){
      this.visible = false;
    },
    handleOk(){

    },
    isFullscreen(val){
      this.fullscreen=true;
    }
  },
}
</script>
<style scoped>
  .content{
    font-size: 18px;
    text-indent: 36px;
    margin: 20px;
    line-height: 36px;
    margin-top: 80px;
  }
</style>